'use client'
import clsx from "clsx";
import {Car, Home, Ship, ShipWheel, Ticket} from "lucide-react";
import { usePathname } from "next/navigation";
import Link from "next/link";
import styles from './NavLinks.module.css';

const adminLinks = [
    { name: 'Главная', href: '/admin', icon: Home },
    { name: 'Корабли', href: '/admin/ships', icon: Ship },
    { name: 'Капитаны', href: '/admin/captains', icon: ShipWheel },
    { name: 'Транспорт', href: '/admin/tickets', icon: Car },
];

const userLinks = [
    { name: 'Главная', href: '/user', icon: Home },
    { name: 'Билеты', href: '/user/tickets', icon: Ticket },
];

export default function NavLinks() {
    const pathname = usePathname();
    const links = pathname.startsWith('/admin') ? adminLinks : userLinks;

    return (
        <>
            {links.map((link) => {
                const LinkIcon = link.icon;
                return (
                    <Link
                        key={link.name}
                        href={link.href}
                        className={clsx(styles.linkStyle, {
                            [styles.linkChosen]: pathname === link.href,
                        })}
                    >
                        <LinkIcon className={styles.linkIcon} />
                        <p className={styles.linkLabel}>{link.name}</p>
                    </Link>
                );
            })}
        </>
    );
}
